<template>
  <div>
    <el-table
      :data="tableData.filter(data => !search || data.name.toLowerCase().includes(search.toLowerCase()))"
      style="width: 94%">
      <el-table-column label="会员编号" prop="mid"/>
      <el-table-column label="会员姓名" prop="mname"/>
      <el-table-column label="电话" prop="mphone"/>
      <el-table-column label="会员积分" prop="mintegral"/>
      <el-table-column label="加入会员时间" prop="createTime"/>
      <el-table-column align="center">
        <template slot="header" slot-scope="scope">
          <el-input v-model="search" size="mini" placeholder="输入商品关键字搜索"/>
        </template>
        <template slot-scope="scope">
          <el-row>
            <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12">
              <el-button type="success" icon="el-icon-edit" round size="mini" @click="handleEdit(scope.$index, scope.row)">修改
              </el-button>
            </el-col>
          </el-row>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<style>
  .qrCode {
    border: 1px solid black;
    margin: 0;
    padding: 0;
    width: 200px !important;
    height: 200px !important;
  }
</style>

<script>
  export default {
    name: "LookMembers",
    data() {
      return {
        dialogVisible: false,
        tableData: [],
        search: ''
      }
    },
    methods: {
      handleEdit(index, row) {
        console.log(index, row);
      },
      handleDelete(index, row) {
        console.log(index, row);
      }
    },
    beforeMount() {
      this.$http({
        url: this.Host + '/members/list',
        method: 'GET',
      }).then(result => {
        console.log(result)
        console.log(result.data.message === 'success')
        if (result.data.message === 'success') {
          this.tableData = result.data.data
        }
        console.info("sdssd")
      }).catch(error => {
        console.info("ff")
      })
    }
  }
</script>

